<template>
    <view class="warp">
        <view class="pc">
            <img src="../../static/images/common/logo.png" alt="">
        </view>
        <view class="conter">
            <u--form labelPosition="left" :model="model1" :rules="rules" ref="form1">
                <u-form-item label="" prop="userInfo.name" ref="item1">
                    <u--input v-model="model1.userInfo.name" border="none" placeholder="请输入手机号"></u--input>
                </u-form-item>
                <u-form-item label="" prop="userInfo.verification" ref="item1">
                    <u--input v-model="model1.userInfo.verification" border="none" placeholder="请输入验证码"></u--input>
                    <verification :name="model1.userInfo.name"></verification>
                </u-form-item> <u-form-item label="" prop="userInfo.password" ref="item1">
                    <u--input v-model="model1.userInfo.password" border="none" placeholder="请输入密码(6-12位)"></u--input>
                </u-form-item>
                <regsing :name="model1.userInfo.name" :verification="model1.userInfo.verification"
                    :password="model1.userInfo.password"></regsing>
                <view class="back_login" @click="back_login">已有账号,返回登录</view>
            </u--form>
        </view>
    </view>
</template>

<script>
import { verification } from "../reg/verification_code.vue"
import { regsing } from "../reg/regsing.vue"
export default {
    components: {
        verification: () => import("../reg/verification_code.vue"),
        regsing: () => import("../reg/regsing.vue")
    },
    data() {
        return {

            model1: {
                userInfo: {
                    name: '15518528086',
                    verification: '',
                    password: '',
                },
            },
            rules: {
                'userInfo.name': {
                    type: 'string',
                    required: true,
                    message: '请输入正确手机号',
                    trigger: ['blur', 'change'],
                    pattern: /^[1][3,4,5,7,8][0-9]{9}$/,
                },
                'userInfo.verification': {
                    type: 'string',
                    required: true,
                    message: '请输入验证码',
                    trigger: ['blur', 'change']
                },
                'userInfo.password': {
                    type: 'string',
                    required: true,
                    message: '请输入密码',
                    trigger: ['blur', 'change']
                },
            }
        }
    },
    mounted() {

    },
    methods: {
        back_login() {
            uni.navigateTo({ url: '/pages/login/login' })

        }
    },

}
</script>

<style lang="scss" scoped>
.warp {
    .pc {
        width: 100%;
        height: 200px;
        display: flex;
        justify-content: center;
        align-items: center;
    }

    img {
        width: 50px;
        height: 50px;

    }

    .conter {
        width: 85%;
        margin: 0 auto;

        .back_login {
            width: 100%;
            margin: 15px auto;
            font-size: 14px;
            color: #fdd100;
            display: flex;
            justify-content: center;
        }
    }
}
</style>